<template>
  <!--  抗菌药物统计-->
  <div class="query">
    <div class="check">
      <div class="c_left">条件搜索栏</div>
      <div class="c_right">
        <div class="clear">
          <div class="fl">
            <span class="c_tip">统计列表</span>
            <el-select
              v-model="statistics"
              filterable
              clearable
              placeholder="请选择"
              class="c_select"
              width="300px"
              style="width: 350px;"
            >
              <el-option
                v-for="item in statisticsList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </div>
        </div>
        <!--       不同的statistics-->
        <mixture-and-group-tatistics v-show="statistics === '医疗组药品消耗情况及使用量DDDs统计表'" />
        <drug-group-mixture-and-drug-group-tatistics v-show="statistics === '药品医疗组消耗情况及使用量DDDs统计表'" />
        <dept-collect-and-dept-list v-show="statistics === '药品使用强度科室统计表'" />
        <group-list-and-group-collect v-show="statistics === '药品使用强度医疗组统计表'" />
        <doctor-list-and-doctor-collect v-show="statistics === '药品使用强度医生统计表'" />
        <hospital-class-and-hospital-drug v-show="statistics === '药品使用强度医院统计表'" />
        <as3 v-show="statistics === '医生药品消耗情况及使用量DDDs统计表'" />
        <as4 v-show="statistics === '药品医生消耗情况及使用量DDDs统计表'" />
        <as5 v-show="statistics === '药品金额、数量及DDDs趋势分析表'" />
        <!--       不同的statistics-->
      </div>
    </div>
  </div>
</template>

<script>
import DeptCollectAndDeptList from './DeptCollectAndDeptList'
import GroupListAndGroupCollect from './GroupListAndGroupCollect'
import DoctorListAndDoctorCollect from './DoctorListAndDoctorCollect'
import HospitalClassAndHospitalDrug from './HospitalClassAndHospitalDrug'
import MixtureAndGroupTatistics from './MixtureAndGroupTatistics'
import DrugGroupMixtureAndDrugGroupTatistics from './DrugGroupMixtureAndDrugGroupTatistics'
import As3 from './As3'
import As4 from './As4'
import As5 from './As5'
export default {
  name: 'AntimicrobialStatistics',
  components: {
    As5,
    As4,
    As3,
    DrugGroupMixtureAndDrugGroupTatistics,
    MixtureAndGroupTatistics,
    HospitalClassAndHospitalDrug,
    DoctorListAndDoctorCollect,
    GroupListAndGroupCollect,
    DeptCollectAndDeptList
  },
  data() {
    return {
      statistics: '医疗组药品消耗情况及使用量DDDs统计表',
      statisticsList: [
        { value: '医疗组药品消耗情况及使用量DDDs统计表', label: '医疗组药品消耗情况及使用量DDDs统计表' },
        { value: '药品医疗组消耗情况及使用量DDDs统计表', label: '药品医疗组消耗情况及使用量DDDs统计表' },
        { value: '医生药品消耗情况及使用量DDDs统计表', label: '医生药品消耗情况及使用量DDDs统计表' },
        { value: '药品医生消耗情况及使用量DDDs统计表', label: '药品医生消耗情况及使用量DDDs统计表' },
        { value: '药品金额、数量及DDDs趋势分析表', label: '药品金额、数量及DDDs趋势分析表' },
        { value: '药品使用强度科室统计表', label: '药品使用强度科室统计表' },
        { value: '药品使用强度医疗组统计表', label: '药品使用强度医疗组统计表' },
        { value: '药品使用强度医生统计表', label: '药品使用强度医生统计表' },
        { value: '药品使用强度医院统计表', label: '药品使用强度医院统计表' }
      ]
    }
  }
}
</script>

<style scoped lang="scss">
  .query{
    width:100%;
    height:100%;
    background:#e6edf5;
    .check{
      font-size:12px;
      line-height:40px;
      background:#fff;
      text-align:center;
      .c_left{
        width:115px;
        float:left;
        line-height:65px;
      }
      .c_right{
        overflow:hidden;
        color:#636365;
        border-left:1px solid #e6edf5;
        padding:15px 0;
        position:relative;
        .show_btn{
          position:absolute;
          right:20px;
          bottom:15px;
          border:1px solid #e1e1e1;
          background:#f9fafc;
          border-radius:2px;
          text-align:center;
          line-height:32px;
          width:70px;
          height:32px;
          font-size:14px;
          color:#9f9f9f;
          cursor: pointer;
        }
        .fl{
          margin-bottom:10px;
          display: flex;
          align-content: center;
          align-items: center;
        }
        .c_tip{
          display:inline-block;
          width:80px;
          padding-right:10px;
          text-align:right;
        }
        .c_input{
          width:131px;
          height:40px;
          border:1px solid #dcdfe6;
          border-radius:4px;
          padding-left:5px;
        }
        .c_input::-webkit-input-placeholder {
          color: #dcdfe6;
        }
        .c_input::-ms-input-placeholder {
          color: #dcdfe6;
        }
        .c_input::-moz-input-placeholder {
          color: #dcdfe6;
        }
        .c_search{
          width:300px;
        }
        .c_searchbtn{
          display:inline-block;
          width:34px;
          height:25px;
          margin-left:3px;
          background:#28a4f4;
          color:#fff;
          font-size:12px;
          text-align:center;
          line-height:26px;
          border-radius:6px;
          cursor:pointer;
        }
        .c_searchbtn_clear{
          display:inline-block;
          width:34px;
          height:25px;
          margin-left:3px;
          background:#F56C6C;
          color:#fff;
          font-size:12px;
          text-align:center;
          line-height:26px;
          border-radius:6px;
          cursor:pointer;
        }
        .c_checkbox{
          width:400px;
          height:40px;
          margin-left: 5px;
          display: flex;
          justify-content: left;
        }
        .btn_clear{
          padding:0;
          width:150px;
          height:40px;
          line-height:40px;
        }
        .sbtn_box{
          text-align:left;
          padding-left:82px;
        }
        .c_select{
          width:130px;
        }
        @media screen and (min-width:1466px){
          .c_select{
            width:150px;
          }
          .btn_clear{
            padding:0;
            width:70px;
            height:40px;
            line-height:40px;
          }
          .c_input{
            width:150px;
          }
          .c_searchbtn{
            width:42px;
            margin-left:4px;
          }
          .c_tip{
            width:100px;
          }
        }
      }
    }
    .list_tip{
      font-size:14px;
      color:#29a4f2;
      padding: 2px;
    }
    .table_box{
      padding:0 18px;
    }
  }
  /deep/.el-checkbox__label{
    width: 100px;
  }
</style>
